// 点击加入购物车右上方红色标记加1 右上方的购物车出现
$(function () {
    var i = 0
    let time;
    let timer;

    // 1.点击按钮++和--
    $(".increment").click(function () {
        var n = $(this).siblings(".num").val()
        n++;
        $(this).siblings(".num").val(n)
        // $(".btn1").click()
    })
    $(".decrement").click(function () {
        var n = $(this).siblings(".num").val()
        if (n == 1) {
            return false
        }
        n--;
        $(this).siblings(".num").val(n)
    })
    // 2.移动购物车
    $(this).find(".header-content-right>.sp1").on("mouseover", function () {
        // if (localStorage.getItem("cart")) {
        //     $(".cart-specially>.imgbox").hide()
        //     $(".cart-specially>.imgbox").prev().show();
        //     $(".cart-specially>.imgbox").prev().prev().show();
        // }
        // else {
        //     $(".cart-specially>.imgbox").prev().hide();
        //     $(".cart-specially>.imgbox").prev().prev().hide();
        //     $(".cart-specially>.imgbox").show()
        // }
        if (JSON.parse(localStorage.getItem("cart")).length == 0) {
            $(".cart-specially>.imgbox").prev().hide();
            $(".cart-specially>.imgbox").prev().prev().hide();
            $(".cart-specially>.imgbox").show()
        }
        else {
            $(".cart-specially>.imgbox").hide()
            $(".cart-specially>.imgbox").prev().show();
            $(".cart-specially>.imgbox").prev().prev().show();
        }
    }).mouseout(function () {
        $(".cart-specially>.imgbox").hide()
        $(".cart-specially>.imgbox").prev().hide();
        $(".cart-specially>.imgbox").prev().prev().hide();
    })


    $(this).find(".lookcar").on("click", function () {
        window.location.href = "./index3.html";
    })

    // 3.点击加入购物车
    // let that = this;
    // $(this).find(".addbtn>.btn1").on("click", function () {
    //     $("#count").addClass("count")
    //     ++i
    //     if ($(".c-2number .num").val() > 1) {
    //         //红色盒子的i+1
    //         $(".count").text(parseInt($(".c-2number .num").val()) + parseInt($(".count").text()))
    //         // 计数*1
    //         $(".count").text(parseInt($(".c-2number .num").val()))
    //         $(".itemcount").text("x" + parseInt($(".count").text()))
    //         i = parseInt($(".c-2number .num").val())
    //         // 商品总计变化
    //         $(".sumprice").text(parseInt($(".price>span").text()) * parseInt($(".count").text()))
    //     } else {
    //         //红色盒子的i+1
    //         $(".count").text(parseInt(i))
    //         // 计数*1
    //         $(".itemcount").text(`x${i}`)
    //         // 商品总计变化
    //         $(".sumprice").text(parseInt($(".price>span").text()) * i)
    //     }
    //     // 信息盒子点击之后显示3秒后消失
    //     $(".cart-specially>.messagebox").show()
    //     clearInterval(timer)
    //     time = 3;
    //     timer = setInterval(function () {
    //         time--
    //         if (time == 0) {
    //             $(".cart-specially>.messagebox").hide()
    //             clearInterval(timer)
    //         }
    //     }, 1000)
    // })

    function init() {
        if (localStorage.getItem("cart")) {
            let arr = JSON.parse(localStorage.getItem("cart"));
            for (let i = 0; i < arr.length; i++) {
                var strHtml = ``;
                strHtml += `
                    <div class="top">
                        <img src="${arr[i].img}" alt="">
                        <div class="txt">
                            <div class="name">${arr[i].sname}</div>
                            <div class="itemcount">x ${arr[i].number}</div>
                        </div>
                        <div class="price">
                            ￥<span>${arr[i].price}</span>
                        </div>
                    </div>
                    `;
                // console.log($("#count"));
                $("#count").text($("#count").text() - 0 + arr[i].number)
                // 商品总计变化
                $(".sumprice").text($(".sumprice").text() - 0 + (arr[i].number) * arr[i].price)
                $(".cart-specially .messagebox").append(strHtml);
            }
            // $(".header-content-right .sp1 #count").text(arr.length);
            // $("#count").addClass("count");
            // if (arr.length == 0) {
            //     return
            // } else {
            //     //红色盒子的i+1
            //     $(".count").text(arr[i].number)
            //     // 计数*1
            //     $(".itemcount").text("x" + arr[i].number)
            //     // 商品总计变化
            //     $(".sumprice").text((arr[i].number) * arr[i].price)
            // }
        }
    }
    init();
})








// 渲染购物车吧购物车加入数据

// $(function () {
//     var dataList = [
//         { id: "FS201", name: "飞科小星球剃须刀FS201", explain: "飞科小星球剃须刀", price: 59, img: "./images/index3-s-img1.png" },
//     ]
//     $(this).find(".addbtn>.btn1").on("click", function () {
//         var id = dataList[0].id
//         //获得购买产品的信息
//         var currentObj;
//         for (var i = 0; i < dataList.length; i++) {
//             if (dataList[i].id == id) {
//                 currentObj = dataList[i]
//                 break
//             }
//         }
//         //得到本地的cookie数据(如果没有就准备一个空数组)
//         var localData = JSON.parse(localStorage.getItem("cart") || '[]');
//         var isfirstAdd = true
//         localData.forEach(function (item) {
//             if (item.id == currentObj.id) {
//                 item.number = Number(item.number) + parseInt($(".c-2number .num").val());
//                 isfirstAdd = false;
//             }
//         })
//         if (isfirstAdd == true) {
//             currentObj.number = 1;
//             localData.push(currentObj);
//         }
//         // localStorage.setItem("cart", JSON.stringify(localData));
//     })
// })

$(function () {
    $(this).find(".addbtn>.btn1").on("click", function () {
        let time;
        let timer;
        // 正则用于过滤汉字
        var reg = /[\u4e00-\u9fa5]/g;
        let sname = $(".infobox .p1").text();
        let id = sname.replace(reg, "");
        let explain = sname.split(id)[0];
        let price = $(".infobox .txt2 .t-left .sp2").text();
        let img = $(".middleImg img").prop("src");
        let number = $(".numberbox .num").val() - 0;
        let shop = {
            sname, id, explain, price, img, number
        }
        console.log(shop);
        var strHtml = ``;
        strHtml += `
            <div class="top">
                <img src="${img}" alt="">
                <div class="txt">
                    <div class="name">${sname}</div>
                    <div class="itemcount">x 1</div>
                </div>
                <div class="price">
                    ￥<span>${price}</span>
                </div>
            </div>
            `;
        // $(".cart-specially .messagebox").append(strHtml);

        $(".messagebox").html(strHtml)
        // return;
        $("#count").addClass("count")
        var dataList = JSON.parse(localStorage.getItem("cart") || '[]');
        // var sname = $(this).parents("body").find(".messagebox").children(".top").children(".txt").children(".name").text()
        // { id: "FS201", name: "飞科小星球剃须刀FS201", explain: "飞科小星球剃须刀", price: 59, img: "./images/index3-s-img1.png" },
        // if (dataList.length >= 0) {
        //     dataList.push(shop)
        //     localStorage.setItem("cart", JSON.stringify(dataList));
        // }
        // else {
        //     dataList.forEach(item => {
        //         if (item.sname = shop.sname) {
        //             item.number += shop.number - 0;
        //         }
        //     })
        //     localStorage.setItem("cart", JSON.stringify(dataList));
        // }
        function init() {
            if (localStorage.getItem("cart")) {
                let arr = JSON.parse(localStorage.getItem("cart"));
                console.log(arr);
                for (let i = 0; i < arr.length; i++) {
                    var strHtml = ``;
                    strHtml += `
                        <div class="top">
                            <img src="${arr[i].img}" alt="">
                            <div class="txt">
                                <div class="name">${arr[i].sname}</div>
                                <div class="itemcount">x ${arr[i].number}</div>
                            </div>
                            <div class="price">
                                ￥<span>${arr[i].price}</span>
                            </div>
                        </div>
                        `;
                    $(".messagebox .txt .name").each((index, item) => {
                        if ($(item).text() == arr[i].sname) {
                            $(item).parent().parent().remove();
                            $("#count").text($("#count").text() - 0 + number)
                            // $(item).next().text("x" + ($("#count").text() - 0 + number))
                            $(".sumprice").text($(".sumprice").text() - 0 + (number) * arr[i].price)
                        }

                    })
                    $(".cart-specially .messagebox").append(strHtml);

                    // 商品总计变化

                }
                // $(".header-content-right .sp1 #count").text(arr.length);
                $("#count").addClass("count");
                // console.log(arr[i].number);

            }
        }
        var isFirstAdd = true;
        dataList.forEach(function (item) {
            if (item.sname == shop.sname) {
                item.number += shop.number - 0;
                isFirstAdd = false;
            }
        })
        if (isFirstAdd == true) {
            // shop.number = 1;
            dataList.push(shop);
        }
        localStorage.setItem("cart", JSON.stringify(dataList));


        // return;
        console.log(sname);
        // for (var i = 0; i < dataList.length; i++) {
        //     if (dataList[i].sname == sname) {
        //         //红色盒子的i+1
        //         $(".count").text(dataList[i].number + number - 0)
        //         // 计数*1
        //         $(".itemcount").text("x" + (dataList[i].number - 0 + number))
        //         // 商品总计变化
        //         $(".sumprice").text((dataList[i].number - 0 + number) * dataList[i].price)
        //     }
        // }
        init();
        // 信息盒子点击之后显示3秒后消失
        $(".cart-specially>.messagebox").show()
        $(".cart-specially>.down").show()
        clearInterval(timer)
        time = 3;
        timer = setInterval(function () {
            time--
            if (time == 0) {
                $(".cart-specially>.messagebox").hide()
                $(".cart-specially>.down").hide()
                clearInterval(timer)
            }
        }, 1000)
        console.log($(".cart-specially>.down"));
    })
})